<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="../common/global.jsp" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>${title}</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <%@ include file="../common/common.jsp" %>
    <!-- AdminLTE Skins. Choose a skin from the css/skins
         folder instead of downloading all of them to reduce the load. -->
    <link rel="stylesheet" href="${staticPath }/static/dist/css/skins/_all-skins.min.css">
    <!-- DataTables -->
    <link rel="stylesheet" href="${staticPath }/static/datatables.net-bs/css/dataTables.bootstrap.min.css">
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">

    <header class="main-header">
        <!-- Logo -->
        <a href="index" class="logo">
            <!-- mini logo for sidebar mini 50x50 pixels -->
            <span class="logo-mini"><b>审批</b></span>
            <!-- logo for regular state and mobile devices -->
            <span class="logo-lg"><b>预售资金审批</b></span>
        </a>
        <!-- Header Navbar: style can be found in header.less -->
        <nav class="navbar navbar-static-top">

            <div class="navbar-custom-menu">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="toNoticeOutAmtAddList?outAmtType=${noticeOutAmtAdd.outAmtType}"><i class="fa fa-table"></i> <span>资金列表</span></a></li>
                    <li class="dropdown notifications-menu">
                        <a href="index">
                            <i class="fa fa-home"><span>首页</span></i>
                        </a>
                    </li>
                    <li class="dropdown notifications-menu">
                        <a href="javascript:logout();"><i class="fa fa-sign-out"></i> <span>退出</span></a>
                    </li>
                </ul>
            </div>
        </nav>
    </header>
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <!-- /.box-header -->
                        <div class="box-body">
                            <table id="example2" class="table table-bordered table-hover">
                                <thead>
                                <tr>
                                    <th>项目名称</th>
                                    <th>金额</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody>
                                <c:forEach var="noticeOutAmtAdd" items="${noticeOutAmtAddList}" varStatus="status">
                                    <tr>
                                        <td>${noticeOutAmtAdd.projectName}</td>
                                        <td><fmt:formatNumber value="${noticeOutAmtAdd.amount}" pattern="0.00"/></td>
                                        <c:if test="${noticeOutAmtAdd.status == roleStatus}">
                                            <td>
                                                <button type="button" class="btn btn-block btn-warning btn-sm">审批</button>
                                            </td>
                                        </c:if>
                                        <c:if test="${noticeOutAmtAdd.status != roleStatus}">
                                            <td>
                                                <button type="button" class="btn btn-block btn-info btn-sm">查看</button>
                                            </td>
                                        </c:if>

                                    </tr>
                                </c:forEach>
                                </tbody>
                            </table>
                        </div>
                        <!-- /.box-body -->
                    </div>
                    <!-- /.box -->
                </div>
                <!-- /.col -->
            </div>
            <!-- /.row -->
        </section>
        <!-- /.content -->
    </div>
</div>
<!-- ./wrapper -->
<!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
<script>
    $.widget.bridge('uibutton', $.ui.button);
</script>

<!-- DataTables -->
<script src="${staticPath }/static/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="${staticPath }/static/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
<script>
    $(function () {

        $('#example2').DataTable({
            'paging': true,
            'lengthChange': false,
            'searching': false,
            'ordering': false,
            'info': true,
            "scrollX": true,
            'autoWidth': false,
            "language": {
                "paginate": {
                    "previous": "上一页",
                    "next": "下一页"
                }
            }
        })
    })
</script>
<script>
    function logout() {
        layer.open({
            content: '确定要退出嘛？',
            btn: ['退出', '取消'],
            yes: function (index) {
                window.location.href = 'logout';
                layer.close(index);
            }
        });
    }
</script>
</body>
</html>
